<template>
  <BasicContainer>
  <el-tabs  v-model="activeName">
    <el-tab-pane name="Basics" label="Basics">
      <Basics v-if="activeName === 'Basics'"></Basics>
    </el-tab-pane>
    <el-tab-pane name="Slots" label="Slots">
      <Slots v-if="activeName === 'Slots'"></Slots>
    </el-tab-pane>
    <el-tab-pane name="Selection" label="Selection">
      <Selection v-if="activeName === 'Selection'"></Selection>
    </el-tab-pane>
  </el-tabs>
  
  </BasicContainer>
</template>
<script lang="ts" setup>
import { ref } from 'vue'

import Basics from './components/basics.vue'
import Slots  from './components/slot.vue'
import Selection from './components/selection.vue'


const activeName = ref('Basics')


</script>

<style lang="scss" scoped></style>